<template>
  <div>这是Son。。。。</div>
  <div class="cet">
    <template v-for="index in film" :key="index.filmId">
      <div class="asd" @click="todata(index.filmId)">
        <img :src="index.poster" alt="" />
        <span>name:{{ index.name }}{{ index.filmId }}</span>
      </div>
    </template>
  </div>
</template>
<script>
// import axios from '@/service'
import { mapState, mapActions } from 'vuex'
export default {
  computed: {
    ...mapState('son', ['film'])
  },
  data() {
    return {}
  },
  methods: {
    ...mapActions('son', ['asyncxios']),
    todata(filmId) {
      this.$router.push('/home/first/' + filmId)
    }
    // chan() {
    //   this.$store.dispatch('son/asyncxios')
    // }
  },
  created() {
    //   axios({
    //     method: 'get',
    //     url: '/gateway?cityId=310100&pageNum=1&pageSize=10&type=1&k=5253448',
    //     headers: {
    //       'X-Host': 'mall.film-ticket.film.list'
    //     }
    //   }).then((res) => {
    //     this.urlmsg = res.films
    //   })
    // this.$store.dispatch('son/asyncxios')
    // console.log('film------->', this.$store.state.film)
    if (this.film.length == 0) {
      this.asyncxios()
    }
  }
}
</script>
<style scoped>
.cet {
  display: flex;
  flex-wrap: wrap;
  width: 800px;
  position: absolute;
  right: 0;
}
img {
  width: 190px;
  height: 190px;
  display: block;
}
.asd {
  width: 200px;
  height: 200px;
}
</style>
